<template>
  <div class="tree-container">
    <tree ref="tree"
          @treeGetlists="treeGetlists"
    ></tree>

    <div class="tree-container-right vw20" >
      <!-- 这是组件要插入的地方 -->
      <div class="page-component-wrap animated fadeIn">
        <el-row style="margin:0px;margin-bottom: 10px;">
          <el-col :span="14">

          </el-col>

          <el-col :span="10">
            <el-button type="primary" @click="$refs.devref.addDevice(0)" icon="el-icon-share">添加备件</el-button>
            <el-button type="primary" @click="$refs.devref.addDevice(1)" icon="el-icon-share">发起申请备件</el-button>
          </el-col>
        </el-row>

        <!-- add edit item -->

        <!--:levStatus="levStatus"-->
        <device ref="devref"
                :treeNodeData.sync="treeNodeData"
                @childGetList="$refs.tbcom.getList()"
        ></device>
        <!--table-->

        <el-table :data="list" style="width: 100%" :row-class-name="tableRowClassName">
          <el-table-column prop="" label="#" >
            <template slot-scope="scope" align="center"><span>{{scope.row.px}}</span></template>
          </el-table-column>
          <el-table-column align="center" label="待办事项" prop="groupName" >
            <template slot-scope="scope"><span>{{scope.row.groupName}}</span></template>
          </el-table-column>

          <el-table-column align="center" label="创建时间" prop="createdTime" >
            <template slot-scope="scope"><span>{{scope.row.createdTime}}</span></template>
          </el-table-column>

          <el-table-column align="center" label="当前待办状态" prop="nodeName" >
            <template slot-scope="scope"><span>{{scope.row.nodeName}}</span></template>
          </el-table-column>
          <el-table-column align="center" label="发起人" prop="operatorName" >
            <template slot-scope="scope"><span>{{scope.row.operatorName}}</span></template>
          </el-table-column>
          <el-table-column label="操作" width="150" >
            <template slot-scope="scope">
              <button @click="handleEdit(scope.row)" class="el-tag el-tag--warning el-tag--mini"
                      style="cursor: pointer;">审核</button>
              <!--<button @click="handleDelete(scope.row)" class="el-tag el-tag&#45;&#45;danger el-tag&#45;&#45;mini"-->
                      <!--style="cursor: pointer;">删除</button>-->
            </template>

          </el-table-column>
        </el-table>

<!--        <tbcom ref="tbcom"
               @updateRow="updateRow"
               @childGetList="$refs.tbcom.getList()"
        ></tbcom>-->

      </div>
    </div>
  </div>
</template>
<script>
  import tree from './comp/deviceTree'
  // import 'filters/handleNum.js'
  import { fetchGet,flowAll} from '@/api/common'
  import { $err, $suc, ERRS, SUCS,$msg} from '@/utils'
  // import Pagination from '@/components/Pagination' // Secondary package based on el-pagination
  import device from './comp/deviceComp' // Secondary package based on el-pagination

  export default {
    name: 'applyCode',
    components: {tree,  device},
    mounted() {
      this.getList()
      // this.initInfo()
    },
    data() {
      return {
        //弹出层
        listLoading: false,  //加载动画
        dialogStatus: '', //值对应textMap中的属性
        //tab
        list:[],
        listQuery:{
          page: 1,
          size: 10, //每页几条
          number: 0, //当前页为第1页,从0计算
          searchText: '',
        },
        //分页搜索
        total: 0,
        searchText: '',
        searchData: {},
        changeSearchData:[{}],
        treeNodeData: {}, //添加修改时保存父级信息
        formSearch: {},
        temp: {},
      };
    },

    methods: {
      handleEdit(row){
        this.$router.push({name:row.groupId,params:row})
      },
      tableRowClassName(row) {
        console.log(row)
        console.log(row.row._id)
        if (row.row._id =='2c9080986993bc4f016993bd103b0003') {
          return 'success-row';
          // return 'warning-row';
        }
/*        else if (row.px === 3) {
          return 'success-row';
        }*/
        return '';
      },
      //add table px
/*      listAddPx() {
        let insIndex = this.listQuery.size * (this.listQuery.page - 1);
        this.list = this.list.map((v, index) => {
          this.$set(v, 'px', insIndex + index + 1);
          return v
        });
      },*/
      initInfo(){
/*        flowAll().then(res => {
          if (res.code == 0) {
            let dat = res.data

          } else {
            $err(res.message)
          }
          this.listLoading = false
        })*/
      },
      getList(){
        this.total = 0;
        this.listLoading = true;
        fetchGet(`flowable/ru/myTask?groupId=`).then(res => {
          if (res.code == 0) {
            let dat = res.data
            console.log(res);
            // this.listQuery.size = dat.size > 0 ? dat.size : this.listQuery.size; //每页几条 //每页几条
            // this.listQuery.page = dat.page > 0 ? dat.page : 1; //当前页为第1页
            // this.total = dat.totalElements; //共多少页
            this.list = dat
            let insIndex = this.listQuery.size * (this.listQuery.page - 1);
            this.list = this.list.map((v, index) => {
              this.$set(v, 'px', insIndex + index + 1);
              // this.$set(v, 'roles',insIndex+index+1);
              this.px = insIndex + index + 1; //最大序号
              return v
            });
            console.log(this.list)

            this.$nextTick()
          } else {
            $err(res.message)
          }
          this.listLoading = false
        })
      },

      // tree点击分发事件
      treeGetlists(data){
        // console.log(333,data);
        // this.$refs.devref.treeNodeData=data
        this.treeNodeData=data
        this.$refs.tbcom.getList(data)
      },
      updateRow(row){
        this.$refs.devref.updateDevice(row)
      },
    },
  }
</script>
<style lang="scss">
  @import './comp/index.scss';

</style>

